<template>
<div>
  <!-- 這裡是輪播圖組件 -->
	<!-- <mt-swipe :auto="4000">
  <mt-swipe-item><img src="../../image/1.jpg"></mt-swipe-item>
  <mt-swipe-item><img src="../../image/2.jpg"></mt-swipe-item>
  <mt-swipe-item><img src="../../image/3.jpg"></mt-swipe-item>
</mt-swipe> -->
<swipe></swipe>
	 <ul class="mui-table-view mui-grid-view mui-grid-9">
		            <li class="mui-table-view-cell mui-media mui-col-xs-4"><router-link to="/home/newsList">
		                   <img src="../../image/16.jpg" alt="">
		                    <div class="mui-media-body">新聞資訊</div></router-link></li>
		            <li class="mui-table-view-cell mui-media mui-col-xs-4"><router-link to="/home/photoList">
		                    <span class="mui-icon mui-icon-email"><span class="mui-badge">5</span></span>
		                    <div class="mui-media-body">圖片分享</div></router-link></li>
		            <li class="mui-table-view-cell mui-media mui-col-xs-4"><router-link to="/home/goodsList">
		                    <span class="mui-icon mui-icon-chatbubble"></span>
		                    <div class="mui-media-body">商品購買</div></router-link></li>
		            <li class="mui-table-view-cell mui-media mui-col-xs-4"><a href="#">
		                    <span class="mui-icon mui-icon-location"></span>
		                    <div class="mui-media-body">留言反饋</div></a></li>
		            <li class="mui-table-view-cell mui-media mui-col-xs-4"><a href="#">
		                    <span class="mui-icon mui-icon-search"></span>
		                    <div class="mui-media-body">視頻專區</div></a></li>
		            <li class="mui-table-view-cell mui-media mui-col-xs-4"><a href="#">
		                    <span class="mui-icon mui-icon-phone"></span>
		                    <div class="mui-media-body">聯繫我們</div></a></li>
		        </ul> 
</div>
</template>
<script>
import swipe from '../common/swipe.vue'
export default{
  components:{
    swipe
  }
}
</script>
<style type="scss">
.mint-swipe {
    height: 200px;
}
.mint-swipe-item:nth-child(1){
   background-color: lightgreen;
  }
.mint-swipe-item:nth-child(2){
   background-color: lightblue;
  }
.mint-swipe-item:nth-child(3){
   background-color: lightgoldenrodyellow;
  }
  img{
    height: 200px;
    width: 100%;
  }
  .mui-grid-view.mui-grid-9 {
    background-color: #fff;
  }
  .mui-grid-view.mui-grid-9 .mui-table-view-cell{
     border: 0;
  }
 li img{
    height: 40px;
    width: 40px;
  }
</style>
